<template>
  <div class="DepartmentaliInforma">
    <div class="pubBig keQu">
      <div class="h0">
        <p class="lt"></p>
      </div>
      <div class="m0">
        <div class="form-group">

          <el-row>
            <el-col :span="2">
              <div class="grid-content bg-purple-light">
                <p class="p1">操作机构：</p>
              </div>
            </el-col>
            <el-col :span="2">
              <div class="grid-content bg-purple-light">
                <select
                  class="form-control"
                  v-model="selectZZJG"
                  @change="getDeptList"
                  placeholder="请选择"
                >
                  <option
                    v-for="(item,index) in zzjgList"
                    :label="item.HospitalName"
                    :value="item"
                    :key="index"
                  ></option>
                </select>
              </div>
            </el-col>
            <el-col :span="18">
              <div class="grid-content bg-purple">
                <el-button type="text"></el-button>
              </div>
            </el-col>
            <el-col :span="2">
              <div class="grid-content bg-purple-light">
                <el-button
                  type="primary"
                  icon="el-icon-plus"
                  @click="showDialog('addKSTJ')"
                ></el-button>
              </div>
            </el-col>
          </el-row>
        </div>
      </div>
      <div class="mContent">
        <div class="Tb">
          <el-table
            ref="multipleTable"
            :data="deptList"
            tooltip-effect="dark"
            style="width: 100%"
          >
            <el-table-column
              prop="DeptId"
              label="科室编码"
              width="120"
            ></el-table-column>
            <el-table-column
              prop="Name"
              label="科室名称"
              show-overflow-tooltip
            ></el-table-column>
            <el-table-column
              prop="PYM"
              label="拼音码"
              show-overflow-tooltip
            ></el-table-column>
            <el-table-column
              prop="Describe"
              label="科室描述"
              show-overflow-tooltip
            ></el-table-column>
            <el-table-column
              prop="AddUserId"
              label="操作员"
              show-overflow-tooltip
            ></el-table-column>
            <el-table-column
              prop="AddTime"
              label="操作时间"
              show-overflow-tooltip
            ></el-table-column>
            <el-table-column
              fixed="right"
              label="操作"
              width="220"
            >
              <template slot-scope="scope">
                <el-button
                  @click.native.prevent="updateRow(scope.$index, deptList)"
                  type="text"
                  size="small"
                >编辑
                </el-button>
                <el-button
                  @click.native.prevent="deleteRow(scope.$index, deptList)"
                  type="text"
                  style="color:red;"
                  size="small"
                >删除
                </el-button>
              </template>
            </el-table-column>
          </el-table>
        </div>
      </div>

      <!--弹框增加科室-->
      <div
        class="blackBg hyCZBg"
        v-if="isShow=='addKSTJ'"
      >
        <div class="panel-default column2">
          <em
            class="closes"
            @click="showDialog('')"
          >×</em>
          <div class="panel-heading">添加机构</div>
          <div class="pucLabel">
            <div class="form-group clearfix">
              <p>
                <label>科室名称：</label>
                <input
                  type="text"
                  class="form-control"
                  v-model="DeptObj.Name"
                />
              </p>
              <p>
                <label>科室编码：</label>
                <input
                  type="text"
                  class="form-control"
                  v-model="DeptObj.DeptId"
                />
              </p>
            </div>
          </div>
          <div class="pucLabel">
            <div class="form-group clearfix">
              <p>
                <label>拼音码：</label>
                <input
                  type="text"
                  class="form-control"
                  v-model="DeptObj.PYM"
                />
              </p>
              <p>
                <label>科室描述：</label>
                <input
                  type="text"
                  class="form-control"
                  v-model="DeptObj.Describe"
                />
              </p>

            </div>
          </div>
          <div class="modal-footer">
            <button
              type="button"
              class="btn btn-default"
              @click="showDialog('')"
            >关闭</button>
            <button
              type="button"
              class="btn btn-primary"
              @click="addKSDataTJ()"
            >保存</button>
          </div>
        </div>
      </div>
      <!--弹框修改机构-->
      <div
        class="blackBg hyCZBg"
        v-if="isShow=='updateKSTJ'"
      >
        <div class="panel-default column2">
          <em
            class="closes"
            @click="showDialog('')"
          >×</em>
          <div class="panel-heading">修改机构</div>
          <div class="pucLabel">
            <div class="form-group clearfix">
              <p>
                <label>科室名称：</label>
                <input
                  type="text"
                  class="form-control"
                  v-model="DeptObj.Name"
                />
              </p>
              <p>
                <label>科室编码：</label>
                <input
                  type="text"
                  class="form-control"
                  v-model="DeptObj.DeptId"
                />
              </p>
            </div>
          </div>
          <div class="pucLabel">
            <div class="form-group clearfix">
              <p>
                <label>拼音码：</label>
                <input
                  type="text"
                  class="form-control"
                  v-model="DeptObj.PYM"
                />
              </p>
              <p>
                <label>科室描述：</label>
                <input
                  type="text"
                  class="form-control"
                  v-model="DeptObj.Describe"
                />
              </p>
            </div>
          </div>
          <div class="modal-footer">
            <button
              type="button"
              class="btn btn-default"
              @click="showDialog('')"
            >关闭</button>
            <button
              type="button"
              class="btn btn-primary"
              @click="updateKSDataTJ()"
            >保存</button>
          </div>
        </div>
      </div>

      <!--弹框编辑详情-->
      <div
        class="blackBg hyCZBg"
        v-if="isShow=='show'"
      >
        <div class="panel-default column2">
          <em
            class="closes"
            @click="showDialog('')"
          >×</em>
          <div class="panel-heading">编辑机构</div>
          <div class="pucLabel">
            <div class="form-group clearfix">
              <div class="threeBox pucLab clearfix">
                <p>
                  <label>医院名称:</label>
                  <input
                    class="form-control"
                    v-model="zzjgInforObj.hospital_name"
                    placeholder="请输入"
                    readonly
                    type="text"
                  />
                </p>

                <p>
                  <label>api-key:</label>
                  <input
                    class="form-control"
                    v-model="zzjgInforObj.md5_code"
                    placeholder="请输入"
                    type="text"
                  />
                </p>

                <p>
                  <label>授权码:</label>
                  <input
                    class="form-control"
                    v-model="zzjgInforObj.license_code"
                    placeholder="请输入"
                    type="text"
                  />
                </p>

                <p>
                  <label>详细地址:</label>
                  <input
                    class="form-control"
                    v-model="zzjgInforObj.address"
                    placeholder="请输入"
                    type="text"
                  />
                </p>

                <p>
                  <label>邮编:</label>
                  <input
                    class="form-control"
                    v-model="zzjgInforObj.zip_code"
                    placeholder="请输入"
                    type="text"
                  />
                </p>

                <p>
                  <label>床位数:</label>
                  <input
                    class="form-control"
                    v-model="zzjgInforObj.bed_num"
                    placeholder="请输入"
                    type="text"
                  />
                </p>

                <p>
                  <label>主治医师数:</label>
                  <input
                    class="form-control"
                    v-model="zzjgInforObj.chief_doctor"
                    placeholder="请输入"
                    type="text"
                  />
                </p>

                <p>
                  <label>主任医师数:</label>
                  <input
                    class="form-control"
                    v-model="zzjgInforObj.vice_chief_doctor"
                    placeholder="请输入"
                    type="text"
                  />
                </p>

                <p>
                  <label>住院医师数:</label>
                  <input
                    class="form-control"
                    v-model="zzjgInforObj.resident_doctor"
                    placeholder="请输入"
                    type="text"
                  />
                </p>

                <p>
                  <label>收费医生数:</label>
                  <input
                    class="form-control"
                    v-model="zzjgInforObj.charge_doctor"
                    placeholder="请输入"
                    type="text"
                  />
                </p>

                <p>
                  <label>用户数:</label>
                  <input
                    class="form-control"
                    v-model="zzjgInforObj.user_count"
                    placeholder="请输入"
                    type="text"
                  />
                </p>
                <p>
                  <label>经营范围:</label>
                  <input
                    class="form-control"
                    v-model="zzjgInforObj.scope_business"
                    placeholder="请输入"
                    type="text"
                  />
                </p>
                <p>
                  <label>联系人:</label>
                  <input
                    class="form-control"
                    v-model="zzjgInforObj.contacts"
                    placeholder="请输入"
                    type="text"
                  />
                </p>

                <p>
                  <label>联系人电话:</label>
                  <input
                    class="form-control"
                    v-model="zzjgInforObj.contact_phone"
                    placeholder="请输入"
                    type="text"
                  />
                </p>

                <p>
                  <label>医院级别:</label>
                  <select
                    class="form-control"
                    v-model="zzjgInforObj.hospital_level"
                    placeholder="请选择"
                  >
                    <option
                      v-for="(item,index) in model_select_hospital_level"
                      :label="item.name"
                      :value="item.code"
                      :key="index"
                    ></option>
                  </select>
                </p>

                <p>
                  <label>医院类型:</label>
                  <select
                    class="form-control"
                    v-model="zzjgInforObj.hospital_type"
                    placeholder="请选择"
                  >
                    <option
                      v-for="(item,index) in model_select_hospital_type"
                      :label="item.name"
                      :value="item.code"
                      :key="index"
                    ></option>
                  </select>
                </p>
                <p>
                  <label>负责人:</label>
                  <input
                    class="form-control"
                    v-model="zzjgInforObj.charge_man"
                    placeholder="请输入"
                    type="text"
                  />
                </p>

                <p>
                  <label>照片地址:</label>
                  <input
                    class="form-control"
                    v-model="zzjgInforObj.photo"
                    placeholder="请输入"
                    type="text"
                  />
                </p>

                <p>
                  <label>停止日期:</label>
                  <input
                    class="form-control"
                    v-model="zzjgInforObj.stopdate"
                    placeholder="请输入"
                    type="text"
                  />
                </p>

                <p>
                  <label>备注:</label>
                  <input
                    class="form-control"
                    v-model="zzjgInforObj.notice"
                    placeholder="请输入"
                    type="text"
                  />
                </p>
              </div>
            </div>
          </div>
          <div class="modal-footer">
            <button
              type="button"
              class="btn btn-default"
              @click="showDialog('')"
            >关闭</button>
            <button
              type="button"
              class="btn btn-primary"
              @click="saveZZJGInfor()"
            >保存</button>
          </div>
        </div>
      </div>
    </div>
  </div>

</template>
<script>
export default {
  name: "Bedinformation",
  data () {
    return {
      msg: "SystemManagement 下的 Bedinformation",
      isShow: "",
      Hospital: {
        HospitalId: -1,
        HospitalCode: "",
        HospitalName: "",
        HospitalImg: "",
        HospitalStatus: 0,
        Describe: "",
        AddUserId: -1,
        AddTime: "2020-01-13T07:02:42.448Z"
      },
      zzjgList: [],
      selectZZJG: null,
      DeptObj: {
        Id: 0,
        HospitalId: 0,
        DeptId: "",
        Name: "",
        PYM: "",
        Describe: "",
        AddUserId: 0,
        AddTime: "2020-01-13T08:24:49.026Z"
      },
      deptList: [],

      /*********************************************************************************************************/

    };
  },
  methods: {
    showDialog (isShow) {
      this.isShow = isShow;
    },
    updateRow (index, rows) {
      console.log("更新条目");
      console.log(rows[index]);
      this.DeptObj = rows[index];
      this.showDialog('updateKSTJ')
    },
    deleteRow (index, rows) {
      console.log("删除条目");
      console.log(rows[index]);
      this.deleteKSDataTJ(rows[index].Id)
    },
    addKSDataTJ () {
      //sf1007000107298
      if (this.selectZZJG == null) {
        this.$message({
          showClose: true,
          message: "请选择操作机构！",
          type: "error"
        });
        return;
      }
      this.DeptObj.HospitalId = this.selectZZJG.HospitalId;
      this.DeptObj.DeptId = this.DeptObj.Name;
      var data = this.DeptObj
      console.log(data);
      this.$post("Dept/Create", data)
        .then(res => {
          console.log(res);
          if (res.code == 0) {
            this.DeptObj.Id = -1;
            this.DeptObj.DeptId = "";
            this.DeptObj.Name = "";
            this.DeptObj.PYM = "";
            this.DeptObj.Describe = "";
            this.DeptObj.HospitalId = -1;
            this.DeptObj.AddUserId = -1;
            this.DeptObj.AddTime = "2020-01-13T08:24:49.026Z"
            this.showDialog("");
            // this.getZZJGList();
          } else {
            this.$message({
              showClose: true,
              message: res.msg,
              type: "error"
            });
          }

        })
        .catch(err => {
          console.log(err);
        });
    },
    updateKSDataTJ () {
      if (this.selectZZJG == null) {
        this.$message({
          showClose: true,
          message: "请选择操作机构！",
          type: "error"
        });
        return;
      }
      this.DeptObj.HospitalId = this.selectZZJG.HospitalId;
      var data = this.DeptObj;
      console.log(data);
      this.$post("Dept/Update", data)
        .then(res => {
          console.log(res);
          if (res.code == 0) {
            this.DeptObj.Id = -1;
            this.DeptObj.HospitalId = -1;
            this.DeptObj.DeptId = "";
            this.DeptObj.Name = "";
            this.DeptObj.PYM = "";
            this.DeptObj.Describe = "";
            this.DeptObj.AddUserId = -1;
            this.DeptObj.AddTime = "2020-01-13T08:24:49.026Z"
            this.showDialog("");
            // this.getZZJGList();
          } else {
            this.$message({
              showClose: true,
              message: res.msg,
              type: "error"
            });
          }

        })
        .catch(err => {
          console.log(err);
        });
    },
    deleteKSDataTJ (Id) {
      var data = {
        Id: Id
      }
      console.log(data);
      this.$post("Dept/Delete", data)
        .then(res => {
          console.log(res);
          if (res.code == 0) {
            this.getDeptList();
          } else {
            this.$message({
              showClose: true,
              message: res.msg,
              type: "error"
            });
          }

        })
        .catch(err => {
          console.log(err);
        });
    },
    getDeptList () {
      this.deptList = [];
      this.DeptObj.Id = -1;
      this.DeptObj.HospitalId = -1;
      this.DeptObj.DeptId = "";
      this.DeptObj.Name = "";
      this.DeptObj.PYM = "";
      this.DeptObj.Describe = "";
      this.DeptObj.AddUserId = -1;
      this.DeptObj.AddTime = "2020-01-13T08:24:49.026Z"
      if (this.selectZZJG == null) {
        this.$message({
          showClose: true,
          message: "请选择操作机构！",
          type: "error"
        });
        return;
      }
      var params = {
        HospitalId: this.selectZZJG.HospitalId,
        name: ""
      };
      this.$get("Dept/GetList", params)
        .then(res => {
          this.deptList = res.data;
          console.log("科室列表查询结果");
          console.log(res);
        })
        .catch(err => {
          console.log(err);
        });
    },
    getZZJGList () {
      this.zzjgList = [];

      var params = {
        name: ""
      };
      this.$get("Hospital/GetList", params)
        .then(res => {
          //this.total = res.data.totalCount;
          this.zzjgList = res.data;
          if (this.zzjgList.length > 0) {
            this.selectZZJG = this.zzjgList[0];
            this.getDeptList();
          }
          console.log("组织机构列表查询结果");
          console.log(res);
        })
        .catch(err => {
          console.log(err);
        });
    },
  }, //
  created () {
    if (this.$route.query.Token) {
      localStorage.setItem('Token', this.$route.query.Token)
    }
    this.getZZJGList();
  }
};
</script>
<style lang="scss">
.DepartmentaliInforma {
  .keQu .mContent {
    clear: both;
  }

  .keQu .form-group {
    height: 45px;
    padding: 6px 5px 0 10px !important;
  }

  .keQu .mContent .ltList {
    border-right: 1px solid #ddd;
    width: 380px;
    position: absolute;
    top: 90px;
    left: 0;
    bottom: 0;
  }

  .keQu .mContent .ltList .p1 + div {
    overflow-y: auto;
    position: absolute;
    left: 0;
    right: 0;
    top: 28px;
    bottom: 0;
  }

  .keQu .mContent .rtList {
    position: absolute;
    top: 90px;
    left: 380px;
    bottom: 0;
    overflow-y: auto;
    right: 0;
  }

  .keQu .mContent .rtList .table {
    width: 600px;
  }

  .keQu .mContent .p1 + div {
    padding: 8px 10px;
  }

  .el-tree-node.is-current > .el-tree-node__content {
    color: #fff;
    background: #155a00 !important;

    .el-button span {
      color: #fff;
    }
  }

  .custom-tree-node {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 14px;
    padding-right: 8px;
  }

  .el-table {
    font-size: 14px !important;
  }

  .el-table thead {
    color: #303133;
  }
}
</style>
